<template>
	
	<navigator url="" class="goods-item">
		<u--image :showLoading="true" :src="goods.cover_url" width="100%" height="310rpx" mode="widthFix"></u--image>
		<view class="goods-title u-line-1">
			{{goods.title}}
		</view>
		<view class="goods-info">
			<view class="goods-price">
				￥{{goods.price}}
			</view>
			<view class="goods-sales">
				已售:{{goods.sales}}
			</view>
		</view>
	</navigator>
	
</template>

<script>
	export default {
		name:"goods-card",
		props:['goods'],
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss" scoped>
	// 商品展示部分样式
		.goods-item {
			margin: 10rpx 20rpx;
			padding: 20rpx;
			box-shadow: 0 10rpx 20rpx rgba(#000, .3);
	
			.goods-title {
				font-size: 30rpx;
				font-weight: 700;
				margin: 20rpx 0;
			}
	
			.goods-info {
				display: flex;
				justify-content: space-between;
	
				.goods-price {
					color: red;
					font-size: 28rpx;
					font-weight: 700;
				}
	
				.goods-sales {
					color: #cccccc;
					font-size: 24rpx;
					font-weight: 700;
				}
			}
		}
</style>
